<?php echo $this->render('/public/header'); ?>
    <script src="https://cdn.bootcss.com/element-ui/2.0.4/index.js"></script>
    <!-- 引入组件库 -->
    <link href="https://cdn.bootcss.com/element-ui/2.0.4/theme-chalk/index.css" rel="stylesheet">
    <div id="main" class="col-lg-12 col-md-12 col-xs-12">
        <el-container>

            <el-aside width="200px">
                <el-row>
                    <el-radio-group v-model="select_value" @change="handlechange">
                        <el-dropdown-item v-for="v in group">
                            <el-radio :label="v.id">{{v.group_name}}</el-radio>
                        </el-dropdown-item>
                    </el-radio-group>
                </el-row>
                <el-button type="text" @click="add">添加分组</el-button>
            </el-aside>

            <el-main>
                <el-checkbox-group v-model="checkList">
                    <el-checkbox v-for="staff in staffs" :label="staff.job_number">{{staff.name}}</el-checkbox>
                </el-checkbox-group>
            </el-main>

        </el-container>
        <el-row>
            <el-col :span="6" :offset="22">
                <el-button @click="update">更新</el-button>
            </el-col>
        </el-row>
        <el-dialog
                title="提示"
                :visible.sync="dialogVisible"
                width="30%"
        >
            <el-input type="text" placeholder="分组名称" ref="group_name"/>
            </el-input>
            <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="addgroup()">确 定</el-button>
  </span>
        </el-dialog>
    </div>

    <script>
        var vm = new Vue({
            el: "#main",
            data: {
                select_value: "1",
                group:<?php echo json_encode($this->params['group']);?>,
                staffs:<?php echo json_encode($this->params['staff']);?>,
                checkList: [],
                dialogVisible: false
            },
            created: function () {
                this.select_value = this.group[0].id;
                this.checkList = this.group[0].staff;
            },
            methods: {
                handlechange(v) {
                    for (var i in this.group) {
                        if (this.group[i].id == v) {
                            this.checkList = this.group[i].staff;
                        }
                    }
                },
                update() {
                    const data = {};
                    data.group = this.select_value;
                    data.staff = this.checkList;
                    this.$confirm('确认修改').then(() => {
                        $.post('/setting/update_broadcast_group', data, (res) => {
                                if (res.code == 1
                                ) {
                                    this.$message(res.msg);
                                }
                                else {
                                    this.$message.error(res.msg);
                                }
                            },
                            'json'
                        )
                    }).catch(() => {
                        }
                    )
                },
                add() {
                    this.dialogVisible = true;
                },
                addgroup() {
                    const group_name = this.$refs.group_name.currentValue;
                    this.dialogVisible = false;
                    $.post('/setting/broadcast_add', {group_name: group_name}, (res) => {
                            if (res.code == 1
                            ) {
                                this.$message(res.msg);
                                setTimeout(() => {
                                        window.location.reload();
                                    },
                                    1000
                                )
                                ;
                            }
                            else {
                                this.$message.error(res.msg);
                            }
                        },
                        'json'
                    )
                    ;
                }
            }
        })
    </script>
<?php echo $this->render('/public/footer'); ?>